<template>
  <section>
    <el-form :inline="true">
      <el-form-item label="样品编号：">
        <el-input type="text" placeholder="样品编号" prefix-icon="el-icon-edit" size="mini"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" round size="mini">按编号检查</el-button>
      </el-form-item>
      <el-form-item label="项目名称：">
        <el-input type="text" placeholder="请输入项目名称" prefix-icon="el-icon-edit" size="mini"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" round size="mini">按名称检查</el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" round size="mini">初审通过</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column type="expand">
        <template slot-scope="props">
          <el-form label-position="left" inline class="demo-table-expand">
            <el-form-item label="样品批次号">
              <span>{{ props.row.sampleID }}</span>
            </el-form-item>
            <el-form-item label="项目名称">
              <span>{{ props.row.reportID }}</span>
            </el-form-item>
            <el-form-item label="方法名称">
              <span>{{ props.row.id }}</span>
            </el-form-item>
            <el-form-item label="测定结果">
              <span>{{ props.row.shopId }}</span>
            </el-form-item>
            <el-form-item label="单位">
              <span>{{ props.row.category }}</span>
            </el-form-item>
            <el-form-item label="录入日期">
              <span>{{ props.row.address }}</span>
            </el-form-item>
            <el-form-item label="检测人员">
              <span>{{ props.row.desc }}</span>
            </el-form-item>
            <el-form-item label="附图">
              <span>{{ props.row.desc }}</span>
            </el-form-item>
            <el-form-item label="原始记录">
              <span>{{ props.row.desc }}</span>
            </el-form-item>
            <el-form-item label="初审通过">
              <span>{{ props.row.desc }}</span>
            </el-form-item>
          </el-form>
        </template>
      </el-table-column>
      <el-table-column label="样品批次号" prop="id"></el-table-column>
      <el-table-column label="项目名称" prop="name"></el-table-column>
      <el-table-column label="方法名称" prop="name"></el-table-column>
      <el-table-column label="测定结果" prop="name"></el-table-column>
      <el-table-column label="操作" prop="desc"></el-table-column>
    </el-table>
       <div class="footer">
      <el-row justify="end" type="flex">
        <div class="block">
          <el-pagination  background layout="prev, pager, next" :total="50"></el-pagination>
        </div>
      </el-row>
    </div>
  </section>
</template>

<style>
.demo-table-expand {
    font-size: 0;
}
.demo-table-expand label {
    width: 90px;
    color: #99a9bf;
}
.demo-table-expand .el-form-item {
    margin-right: 0;
    margin-bottom: 0;
    width: 50%;
}
</style>
